<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基本标签</title>
</head>
<body>

<h1>注册</h1>
<!--
表单 form
action 表单提交的位置，可以是网站，也可以是一个请求处理地址
method post安全，大文件 get不安全，高效
-->
<form action="MyFirstHTML.html" method="get">
    <!--
    文本输入框 input
    type text文本，password密码,submit提交，reset重置
    -->
    <p>名字：<input type="text" name="username"></p>
    <p>密码：<input type="password" name="password"></p>

    <!--
    input radio 单选框
    value 对应值
    name 对应组
    checked 默认选中
    -->
    <p>性别
        <!--
        name一样，表示radio在同一个组
        -->
        <input type="radio" value="boy" name="sex" checked>男
        <input type="radio" value="girl" name="sex">女
    </p>

    <!--
    input checkbox 多选框
    value 对应值
    name 对应组
    checked 默认选中
    -->
    <p>
        爱好：
        <input type="checkbox" value="sleep" name="interset" checked>睡觉
        <input type="checkbox" value="code" name="interset">敲代码
        <input type="checkbox" value="chat" name="interset">聊天
        <input type="checkbox" value="game" name="interset">游戏
    </p>

    <!--
    input button 按钮
    name 按钮控件名
    value 按钮上显示的文本
    -->
    <p>按钮：
        <input type="button" name="btr1" value="点击变长">
    </p>

    <!--
    input image 图片提交按钮 根submit有同样的效果
    src 图片路径
    -->
    <p>图片提交按钮：
        <input type="image" src="../../image/1.jpg" alt="图片提交按钮">
    </p>

    <!--
    input submit 提交按钮
    -->
    <input type="submit">

    <!--
    input reset 重置按钮
    -->
    <input type="reset">

    <!--
    select 下拉框
    select option 下拉框选项
    select name 下拉列表控件名
    -->
    <p>
        国家：
        <select name="country" >
            <option value="china">中国</option>
            <option value="america">美国</option>
            <option value="Japan">小日本</option>
        </select>
    </p>
    
    <!--
    textarea 文本域
    name 文本域控件名
    -->
    <p>建议：<br>
        <textarea name="suggest" cols="30" rows="10"></textarea>
    </p>

    <!--
    input file 文件域
    name 文件域控件名
    -->
    <p>文件域：
        <input type="file" name="filearea">
        <input type="submit" value="上传文件" name="upload">
    </p>

    <!--
    input email 邮件 自带基本验证
    -->
    <p>邮箱：
        <input type="email" name="email">
    </p>

    <!--
    input url URL 自带基本验证
    -->
    <p>URL：
        <input type="url" name="url">
    </p>

    <!--
    input number 数字
    -->
    <p>数字：
        <input type="number" name="num" max="100" min="0" step="10">
    </p>

    <!--
    input range 滑块
    -->
    <p>音量：
        <input type="range" name="voice" min="0" max="100" step="2" value="20">
    </p>

    <!--
    搜索框
    -->
    <p>搜索框：
        <input type="search" name="search">
    </p>

</form>

</body>
</html>